<?php if (!defined('THINK_PATH')) exit();?><!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="renderer" content="webkit">
<title></title>
<link rel="stylesheet" href="<?php echo (C("CSS_URL")); ?>/pintuer.css">
<link rel="stylesheet" href="<?php echo (C("CSS_URL")); ?>/admin.css">
<script src="<?php echo (C("JS_URL")); ?>/jquery.js"></script>
<script src="<?php echo (C("JS_URL")); ?>/pintuer.js"></script>
</head>
<body>
<div class="panel admin-panel">
  <div class="panel-head" id="add"><strong><span class="icon-pencil-square-o"></span><?php echo ($title); ?></strong></div>
  <div class="body-content">
    <form class="form-x"  enctype="multipart/form-data" name="user">
      <div class="form-group">
        <div class="label">
          <label>用户名：</label>
        </div>
        <div class="field">
          <input type="text" class="input w50" value="" name="username"  placeholder="请输入用户名"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="username" style="color:#F00;"></span>
          <div class="tips"></div>
        </div>
      </div>
        <div class="form-group">
            <div class="label">
                <label>密码：</label>
            </div>
            <div class="field">
                <input type="password" class="input w50" value="" name="password"  placeholder="请输入密码" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="password" style="color:#F00;"></span>
                <div class="tips"></div>
            </div>
        </div>
        <div class="form-group">
            <div class="label">
                <label>确认密码：</label>
            </div>
            <div class="field">
                <input type="password" class="input w50" value="" name="repassword"  placeholder="请输入密码" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="repassword" style="color:#F00;"></span>
                <div class="tips"></div>
            </div>
        </div>
        <div class="form-group">
            <div class="label">
                <label>性别：</label>
            </div>
            <div class="field">
                <select name="sex" class="input w50">
                    <option value="">请选择</option>
                    <option value="1">男</option>
                    <option value="2">女</option>
                </select>
                <div class="tips"></div>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="sex" style="color:#F00;"></span>
            </div>
        </div>
        <div class="form-group">
            <div class="label">
                <label>身份证号：</label>
            </div>
            <div class="field">
                <input type="text" class="input w50" value="" name="id_code"  placeholder="请输入身份证号"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="id_code" style="color:#F00;"></span>
                <div class="tips"></div>
            </div>
        </div>
      <div class="form-group">
        <div class="label">
          <label>上传身份证图片：</label>
        </div>
        <div class="field">
            <input type="file" name="biz_certificate" style="display:none;"/>
          <input type="text" id="upload_biz" name="upload_biz" class="input tips" style="width:25%; float:left;"  value=""  data-toggle="hover" data-place="right" data-image="" readonly="readonly"/>
          <input type="button" class="button bg-blue margin-left" id="image1" value="+ 浏览上传"  style="float:left;" onclick="$('input[name=biz_certificate]').click()">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="id_photo" style="color:#F00;"></span>
          <div class="tipss"></div>
        </div>
          <div id="viewImg_biz" class="viewImg_add" style="padding-left: 150px;">
              <img id="image_biz" class="image" src=""/>
          </div>
      </div>
        <div class="form-group">
            <div class="label">
                <label>联系方式：</label>
            </div>
            <div class="field">
                <input type="text" class="input w50" value="" name="tel"   placeholder="请输入联系方式"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="tel" style="color:#F00;"></span>
                <div class="tips"></div>
            </div>
        </div>
        <div class="form-group">
            <div class="label">
                <label>邮箱：</label>
            </div>
            <div class="field">
                <input type="text" class="input w50" value="" name="email"  placeholder="请输入邮箱" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="email" style="color:#F00;"></span>
                <div class="tips"></div>
            </div>
        </div>
      <div class="clear"></div>
      <div class="form-group">
        <div class="label">
          <label></label>
        </div>
        <div class="field">
          <div class="button bg-main icon-check-square-o tijiao" style="cursor:pointer;"> 提交</div>
        </div>
      </div>
    </form>
  </div>
</div>

</body></html>
<script>
    //预览图片
    function loadImageFile(obj,flag) {
        if (obj.files.length === 0) { return; }
        var oFile = obj.files[0];
        $('#viewImg'+flag).css('display','block');
        if (!rFilter.test(oFile.type)) { alert("You must select a valid image file!"); return; }
        oFReader.readAsDataURL(oFile);
    }
    function preViewImg(obj,flag){
        oFReader = new FileReader(), rFilter = /^(?:image\/bmp|image\/cis\-cod|image\/gif|image\/ief|image\/jpeg|image\/jpeg|image\/jpeg|image\/pipeg|image\/png|image\/svg\+xml|image\/tiff|image\/x\-cmu\-raster|image\/x\-cmx|image\/x\-icon|image\/x\-portable\-anymap|image\/x\-portable\-bitmap|image\/x\-portable\-graymap|image\/x\-portable\-pixmap|image\/x\-rgb|image\/x\-xbitmap|image\/x\-xpixmap|image\/x\-xwindowdump)$/i;
        oFReader.onload = function (oFREvent) {
            document.getElementById("image"+flag).src = oFREvent.target.result;
        };

        loadImageFile(obj,flag);
    }
    $('input[name="biz_certificate"]').change(function(){
        var path=$(this).val();
        path = path.split('\\');
        path = path[path.length-1];
        $('#upload_biz').val(path);
        //预览图片
        preViewImg(this,'_biz');
    });
    //验证邮箱
    function checkEmail(email,obj){
        $.ajax({
            url:'/Admin/Admin/checkEmailUnique',
            type:'post',
            data:{email:email},
            dataType:'json',
            success:function(re){
                obj.html(re.tips);
            }
        });
    }
    //验证手机号的唯一性
    function checkTel(tel,obj){
        $.ajax({
            url:'/Admin/Admin/checkTelUnique',
            type:'post',
            data:{tel:tel},
            dataType:'json',
            success:function(re){
                obj.html(re.tips);
            }
        });
    }
   //验证用户唯一性
    function checkUser(username,obj){
        $.ajax({
            url:'/Admin/Admin/checkUserUnique',
            type:'post',
            data:{username:username},
            dataType:'json',
            success:function(re){
                obj.html(re.tips);
            }
        });
    }
    //验证用户名
    var attr_name=obj_tips='';
    $('input[name="username"]').blur(function(){
        attr_name=$(this).prop('name');
        obj_tips=$('#'+attr_name);
        if($(this).val()==''){
            obj_tips.html('用户名不能为空！');
        }else{
            checkUser($(this).val(),obj_tips);
        }
    });
    //验证密码
    var regexp_pw=/^[a-zA-Z0-9_*@#]{6,18}$/;
    $('input[name="password"]').blur(function(){
        attr_name=$(this).prop('name');
        obj_tips=$('#'+attr_name);
        if($(this).val()==''){
            obj_tips.html('密码不能为空！');
        }else if(!regexp_pw.test($(this).val())){
            obj_tips.html('密码必须由6-18位字母、数字或特殊字符( _ , * , # , @ )组成！');
        }else{
            obj_tips.html('');
        }
    });
    $('input[name="repassword"]').blur(function(){
        attr_name=$(this).prop('name');
        obj_tips=$('#'+attr_name);
        if($(this).val()!==$('input[name="password"]').val()){
            obj_tips.html('确认密码错误！');
        }else{
            obj_tips.html('');
        }
    });
     //验证性别
    $('select[name="sex"]').blur(function(){
        attr_name=$(this).prop('name');
        obj_tips=$('#'+attr_name);
        if($(this).val()==''){
            obj_tips.html('性别不能为空！');
        }else{
            obj_tips.html('');
        }
    });
    //验证身份证号
    var regexp_id=/^[1-9]\d{5}(\d{9}|\d{11}[0-9X])$/;
    $('input[name="id_code"]').blur(function(){
        attr_name=$(this).prop('name');
        obj_tips=$('#'+attr_name);
        if($(this).val()==''){
            obj_tips.html('身份证号码不能为空！');
        }else if(!regexp_id.test($(this).val())){
            obj_tips.html('身份证号码不合法！');
        }else{
            obj_tips.html('');
        }
    });

   //验证联系方式
    var regexp_mobile=/^1[3-9]\d{9}$/;
    var regexp_tel=/^0([12]\d{9}|[3-9]\d{9,10})$/;
    $('input[name="tel"]').blur(function(){
        attr_name=$(this).prop('name');
        obj_tips=$('#'+attr_name);
        if($(this).val()==''){
            obj_tips.html('联系方式不能为空！');
        }else if(!regexp_mobile.test($(this).val()) && !regexp_tel.test($(this).val())){
            obj_tips.html('联系方式不合法！');
        }else{
            checkTel($(this).val(),obj_tips);
        }
    });
    //验证邮箱
    var regexp_email=/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
    $('input[name="email"]').blur(function(){
        attr_name=$(this).prop('name');
        obj_tips=$('#'+attr_name);
        if($(this).val()==''){
            obj_tips.html('邮箱不能为空！');
        }else if(!regexp_email.test($(this).val())){
            obj_tips.html('邮箱格式不正确！');
        }else{
            checkEmail($(this).val(),obj_tips);
        }
    });

    var username=password=repassword=sex=id_code=id_photo=tel=email='';
    function checkForm(){
        username=$('input[name="username"]').val();
        if(username==''){
            $('#username').html('用户名不能为空！');
            return false;
        }
        password=$('input[name="password"]').val();
        if(password==''){
            $('#password').html('密码不能为空！');
            return false;
        }else if(!regexp_pw.test(password)){
            $('#password').html('密码必须由6-18位字母、数字或特殊字符( _ , * , # , @ )组成！');
            return false;
        }
        repassword=$('input[name="repassword"]').val();
        if(repassword!==password){
            $('#repassword').html('确认密码错误！');
            return false;
        }
        sex=$('select[name="sex"]').val();
        if(sex==''){
            $('#sex').html('性别不能为空！');
            return false;
        }
        id_code=$('input[name="id_code"]').val();
        if(id_code==''){
            $('#id_code').html('身份证号码不能为空！');
            return false;
        }else if(!regexp_id.test(id_code)){
            $('#id_code').html('身份证号码不合法！');
            return false;
        }
        id_photo=$('input[name="upload_biz"]').val();
        if(id_photo==''){
            $('#id_photo').html('身份证照片没有上传！');
            return false;
        }else if(!/\.(jpg|jpeg|gif|png)$/.test(id_photo)){
            $('#id_photo').html('上传文件必须是jpg,jpeg,gif,png格式！');
            return false;
        }else{
            $('#id_photo').html('');
        }
        tel=$('input[name="tel"]').val();
        if(tel==''){
            $('#tel').html('联系方式不能为空！');
            return false;
        }else if(!regexp_mobile.test(tel) && !regexp_tel.test(tel)){
            $('#tel').html('联系方式不合法！');
            return false;
        }
        email=$('input[name="email"]').val();
        if(email==''){
            $('#email').html('邮箱不能为空！');
            return false;
        }else if(!regexp_email.test(email)){
            $('#email').html('邮箱格式不正确！');
            return false;
        }
    }

    function postData(){
        var data={username:username,password:password,repassword:repassword,sex:sex,id_code:id_code,tel:tel,email:email};
        $.ajax({
            url:'/Admin/Admin/ajaxCheckData/scene/addUser',
            type:'post',
            data:data,
            dataType:'json',
            success:function(re){
                if(re.error==1){
                    $.each(re.errInfo,function(key,val){
                        $('#'+key).html(val);
                    })
                    window.location.href='#mask';
                }else{
                    $('form[name="user"]').prop('action','add').prop('method','post');
                    $('form[name="user"]').submit();
                }
            }
        });
    }

    $('.tijiao').click(function(){
        var flag;
        flag=checkForm();//提交前的验证
        if(flag===false){
            window.location.href='#mask';
        }else{
            postData();//发送数据进行验证
        }
    });
</script>